import { useState } from "react"

// interface User{
//   name: string,
//   age: number
// }
interface Props {
  name: string,
  children?: React.ReactNode
  onGetMsg?: (msg: string) => void
}

function App() {
  // const [count, setCount] = useState(0)
  // const[list, setList] = useState<number[]>([1,2,3,4,5])
  // const [input, setInput] = useState("")
  // const [user, setUser] = useState<User | null|undefined>({
  //   name: "",
  //   age: 0
  // })
  const Button = (props: Props) => {

    const onHanderClick = () => {
      props.onGetMsg?.("getmsg")
    }
    return <>
      <div>{props.name}</div>
      <div>{props.children}</div>
      <button onClick={onHanderClick}>click</button>
    </>
  }
  return (
    <>
      <div>app</div>
      <Button name="sonbutton" onGetMsg={(msg) => { console.log(msg) }}><h1>test1</h1></Button>
    </>
  )
}

export default App
